<template>
  <div>
    <el-table :data="filteredTableData" style="width: 100%">
      <el-table-column type="selection" width="50"></el-table-column>
      <el-table-column v-for="gridColumn in gridColumns" :label="gridColumn.label" :property="gridColumn.property">
      </el-table-column>
  
      <el-table-column inline-template label="操作" align="center" property="id">
        <el-button type="text" size="mini">查看详情</el-button>
      </el-table-column>
    </el-table>
    <el-row type="flex" justify="end" style="padding:20px 0; ">
      <el-pagination :current-page="1" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="sizes, prev, pager, next" :total="1000" v-on:current-change="pageIndexChange">
      </el-pagination>
    </el-row>
  </div>
</template>

<script>
export default {
  name: 'page',
  data: function () {
    return {
      totalActiveNum: 3,
      totalSignUp: 204,
      auditNum: 15,
      activeNum: 0,
      currentType: '全部',
      selectItems: [],
      types: ['全部', '测试活动', '免费活动', '收费活动'],
      tableData: [],
    }
  }, computed: {
    filteredTableData: function () {
      var type = this.currentType;
      return this.tableData.filter(function (data) {
        if (type == '全部' || type == '') {
          return true
        } else {
          return data.type == type
        }
      })
    }
  },
  props: {
    list: Array, url: "", gridColumns: Array
  }, mounted() {
    // this.pageInit();	 
  },
  methods: {
    pageIndexChange: function (pageIndex) {
      alert(pageIndex);
      this.pageInit();
    },
    pageInit: function () {
      this.$http.get(this.url).then(
        function (res) {
          console.log(res.body.tableData);
          this.tableData = res.body.tableData;
        }, function (res) {

        }
      );
    }
  }
}

</script>
